// 封装axios

// 1.导入axios框架
import axios from "axios";
import type {AxiosInstance,AxiosRequestConfig,AxiosResponse} from "axios";

// import {useRouter} from "vue-router"


import $router from "@/router/index"

export default function (config:AxiosRequestConfig) {
    // 2.创建axios实例
    const axiosInstance:AxiosInstance = axios.create({
        baseURL: '/api',
        timeout: 5000
    })

    // 3.axios的拦截器
    // （1）请求拦截器的作用
    // =>修改config中一些不符合服务器要求的信息
    // =>在页面中展示发送网络请求时，等待请求的图标
    // =>检测某些网络请求（比如登录（token）），必须携带一些特殊信息
    axiosInstance.interceptors.request.use(config => {
        // console.log("发送请求成功的拦截");
        // 请求头携带token
        config.headers.Authorization="Bearer "+ localStorage.getItem("token")
        return config;
    }, err => {
        // console.log("发送请求失败的拦截");
        return err;
    })

    // （2）响应拦截器的作用
    // 响应成功拦截中，主要是对数据进行过滤
    // 响应失败的拦截中，可以根据status判断报错的错误码，跳转到不同的错误提示页面
    axiosInstance.interceptors.response.use((response:AxiosResponse) => {
        // console.log("res", response);
        // console.log("响应成功的拦截");
        return response.data;
    }, err => {
        // console.log("err", err);
        // console.log("响应失败的拦截");
        if (err.response.status === 401) {
            // err.message="请求错误";
            alert("登录过期！请重新登录！");
            // 删除本地保存的token
            localStorage.removeItem("token");
            // 跳转到登录页面
            $router.replace("/login");

        }else{
            alert("未知错误");
        }
    })

    // 4.把处理返回值的步骤返回出去
    // 方法一：把回调函数作为参数传入进来
    // axiosInstance(config).then(res=>{
    //    success(res);
    // })

    // 方法二：直接返回一个promise对象(推荐)
    return axiosInstance(config)

}